<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/js/jquery.min.js"></script>
    <script type="text/javascript" src="js/xitong_user.js"></script>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        #table1{
            border:1px solid #2aabd2;
            width: 50%;
            background-color: lightcyan;
        }
        #table3{
            border:1px solid #2aabd2;
            width: 50%;
            background-color: lightcyan;
        }
        #table2{
            width: 100%;
        }
        #table2 tr:nth-child(odd){
            background-color: #eee;
        }
        #table2 tr:hover{
            background-color: #ccc;
        }
        #table2 tr td:first-child{
            color: #f40;
        }

        #table2 tr td{
            text-align: right;
            padding-right: 20px;
        }
        #pwdStrength{
            width: 80%;
            list-style: none;
            height: 30px;
            display: flex;
            flex: 1;
        }
        #weak,
        #middle,
        #strong{
            height: 20px;
            width: 35px;
            border: 1px solid black;
            background: rgb(238, 238, 238);
        }
        #middle{
            border-left: 0;
            border-right: 0;
        }

    </style>
</head>
<body>
<!--<button th:text="操作" th:value="${everyUse.userId}" onclick="ajaxbt(this.value)"></button>-->
<!--<input type="radio" name="ever" th:value="${everyUse.userId}" onclick="ajaxbt(this.value)" class="input1">-->
<form action="xitong_selectUser.do">
    <table id="table1" border="1">
        <tr>
            <td colspan="5">用户ID</td>
            <td><input type="text" id="userID" name="userID" th:value="${session.userID}"></td>
        </tr>
        <tr>
            <td colspan="5">用户名称</td>
            <td><input type="text" id="userName" name="userName" th:value="${session.userName}"></td>
        </tr>
        <tr>
            <td colspan="5"><input type="submit" value="查询"></td>
            <td></td>
        </tr>
    </table>
    每页显示条数<select name="pageRows" id="pageRows" onchange="lastpage1(this.value)">
    <option th:each="i:${session.list}" th:text="${i}" th:value="${i}" th:selected="${session.pageRows == i}"></option>
</select>
    第<label th:text="${session.pageInfo.getPageNum()}"></label>页
    <input type="hidden" th:value="${session.pageInfo.getPageNum()}" id="pageNum">
</form>
<label th:if="${session.pageInfo.size==0}" style="color: #ff4400">没有查到任何数据!请核对查询信息</label>
<table id="table2" th:if="${session.pageInfo.size!=0}">
    <tr><td>用户ID</td><td>用户名</td><td>登陆账号</td><td>用户类型</td><td>性别</td><td>编辑时间</td><td>是否删除</td><td>操作</td></tr>
    <tr th:each="everyUse:${session.pageInfo.getList()}"><td th:text="${everyUse.userId}"></td><td th:text="${everyUse.userName}"></td><td th:text="${everyUse.userAccount}"></td><td th:text="${everyUse.userType}"></td><td th:text="${everyUse.userSex}"></td><td th:text="${everyUse.userEditTime}"></td><td th:text="${everyUse.userIsDel eq 1?'是':'否'}"></td><td><button th:text="操作" th:value="${everyUse.userId}" onclick="ajaxbt(this.value)"></button></td></tr>
    <tr><button th:value="${session.pageInfo.getPageNum()>1?session.pageInfo.getPageNum()-1:session.pageInfo.getPageNum()}" onclick="lastpage(this.value)">上一页</button>
        <button th:value="${session.pageInfo.getPageNum()<session.pageInfo.pages?session.pageInfo.getPageNum()+1:session.pageInfo.getPageNum()}" onclick="lastpage(this.value)">下一页</button></tr>
</table>

<form action="xitong_updateUser.do" id="form1">
    <table id="table3" th:if="${session.wmsTUser!=null}">
        <tr><td>用户名称</td><td><input type='hidden' id='userId1' name='userId' th:value="${session.wmsTUser.userId}"><input id="userName1" name="userName" type='text' th:value="${session.wmsTUser.userName}"></td></tr>
        <tr><td>用户登录帐号</td><td><input type='text'  id='userAccount' name='userAccount' th:value="${session.wmsTUser.userAccount}"></td></tr>
        <tr><td>登陆密码</td><td><input type='text'  id='userPwd' name='userPwd' th:value="${session.wmsTUser.userPwd}"></td></tr>
        <tr><td>安全性</td><td><ul id="pwdStrength">
            <li id="weak">弱</li>
            <li id="middle">中</li>
            <li id="strong">强</li>
        </ul></td></tr>
        <tr><td>确认密码</td><td><input type="password" name="reuserPwd" id="reuserPwd"></td></tr>
        <tr><td>用户类型</td><td><select name="userType" id="userType">
            <option th:each="everyPerm:${session.wmsTPermissions}" th:text="${everyPerm.permName}" th:value="${everyPerm.permId}" th:selected="${everyPerm.permId eq session.wmsTPermission.permId}"></option>
        </select></td></tr>
        <tr><td>所在组</td><td><input type="hidden" name="permId" th:value="${session.wmsTPermission.permId}"><input th:value="${session.wmsTPermission.permName}" disabled="disabled">
            <label id="lagroup">选择</label>
            <table id="tbgroup" border="1"></table>
        </td></tr>
        <tr><td>性别</td><td><input type='radio' name='userSex' value='男' id='men' th:checked="${session.wmsTUser.userSex eq '男'}"><label for='men'>男</label><input type='radio' name='userSex' value='女' id='femen' th:checked="${session.wmsTUser.userSex eq '女'}"><label for='femen'>女</label></td></tr>
        <tr><td rowspan='3'>备注</td><td rowspan='3'><textarea cols='30' rows='3' name="userNote" id="userNote" th:text="${session.wmsTUser.userNote}"></textarea></td></tr>
        <tr><td>编辑时间</td><td><input name='userEditTime' id='time'></td></tr>
        <tr><td>状态</td><td><input type='radio' value='delete' name='edit' id='delete'><label for='delete'>删除</label><input type='radio' value='edit' id='edit' name='edit' checked='checked'><label for='edit'>操作</label></td></tr>
        <tr><td></td><td><input type="submit" value="提交"><input type="reset" value="重置"></td></tr>
    </table>
</form>
</body>
<script type="text/javascript">

    function lastpage(page) {
        var userName = $("#userName").val();
        var userID = $("#userID").val();
        var pagerows = $("#pageRows").val();
        window.location = "xitong_selectUser.do?pageNum="+page+"&pageRows="+pagerows+"&userName="+userName+"&userID="+userID;
    }
    function lastpage1(row) {
        var userName = $("#userName").val();
        var userID = $("#userID").val();
        var pageNum = $("#pageNum").val();
        window.location = "xitong_selectUser.do?pageNum="+pageNum+"&pageRows="+row+"&userName="+userName+"&userID="+userID;
    }

    function ajaxbt(userID) {
        $.ajax({
            type:"get",
            url:"xitong_getOneuser.do?userID="+userID,
            success:function (data) {

                window.location.reload();
            }
        })
    }
    function datetime() {
        var now = new Date();
        document.getElementById("time").value = now.getFullYear() + "-"
            + (now.getMonth() + 1) + "-" + now.getDate()+" ";
        document.getElementById("time").value += " " + now.getHours() + ":"
            + now.getMinutes() + ":" + now.getSeconds();
    }
    window.setInterval("datetime()");
</script>
</html>